<template>
  <div class="house">
       <van-nav-bar
        title="找房"
        >
        <template #left>           
            <city/>
        </template>
      </van-nav-bar>
      <!-- 筛选 -->
       <fit @sure="sure"  @qux="qux"/>
      <!-- 房源列表 -->

      <van-card
        v-for="v in houselist"
        :key="v.title"
        centered
        :price="v.price+'.00/月'"
        @click="godet(v.houseCode)"
        :title="v.title"
        :thumb="v.houseimg"
      >
        <template #tags>
          <van-tag  :type="j%2==0?'success':'primary'" v-for="i,j in v.tags" :key="i" style="margin:5px">
            {{i?i:'暂无描述'}}
          </van-tag>
          
        </template>
       
      </van-card>

  </div>
</template>

<script>
import city from "../components/GetCity.vue"
import fit from "../components/Fit.vue"
export default {
   components:{city,fit},
   data () {
     return {
       houselist:[]
     }
   },
   methods: {
     init(obj={}){// 获取房源信息 默认其他可选参为空
         // 组合参数 需要当前城市的id
         let areaID=JSON.parse(localStorage.getItem("cityinfo")).code// 
         
         this.$axios.getHouse({areaID,...obj})
         .then(res=>{
           console.log(res);
           if(res.data.code==200){
             this.houselist=res.data.msg
           }
         })
     },
     sure(v){// 确认筛选 子组件传过来的参数 父组件接收 
        console.log(v);// 筛选的条件 {}
        // 组合参数 调用初始的方法
        let {// 解构赋值
          roomTypeID,
          orientedID,
          floor,
          tagsID,
          price
        }=v
        let obj={// 组合参数
          roomTypeID,
          orientedID,
          floor,
          tagsID,
          price
        }

        // console.log(obj);
        console.log(obj);
        this.init(obj)
     },
     qux(){// 取消筛选
         this.init()// 回到最初的状态
     },
     godet(code){// 到详情
         this.$router.push("/det?code="+code)
     }
   },
   mounted () {
     this.init()
   }

}
</script>

<style>

</style>